<template>
  <BeModal v-model:open="props.showModal" centered width="400px" title="保存查询模型" @ok="onOk" @cancel="handleCancel" confirmText="保存" customClose :showFooter="true">
    <a-form :model="formData" :rules="rulesRef" ref="formRef">
      <a-form-item label="" prop="name">
        <a-input v-model:value="formData.name" placeholder="请输入模型名称" />
      </a-form-item>
    </a-form>
  </BeModal>
</template>
<script setup lang="ts">
const emit = defineEmits(['update:showModal', 'reload'])
import { logAuditApi } from '@/api/log-audit'
import { message } from 'ant-design-vue'
interface Props {
  showModal: boolean
  contents: string
}

const props = withDefaults(defineProps<Props>(), {
  showModal: false,
  contents: ''
})
const formRef = ref()
const formData = reactive({
  name: ''
})
const rulesRef = reactive({
  name: [
    {
      required: true,
      message: '请输入模型名称'
    }
  ]
})

// 确定按钮回调
const onOk = async () => {
  try {
    const value = await formRef.value.validateFields()
    console.log(value)
    const res = await logAuditApi.AddLogAuditModel({ data: { ...value, contents: props.contents } })
    message.success('操作成功！')
    emit('reload')
    // 关闭模态框
    handleCancel()
  } catch (error) {
    console.log(error)
    return
  }
}

// 取消按钮回调
const handleCancel = () => {
  formRef.value.resetFields()
  emit('update:showModal', false)
}
</script>
<style lang="scss" scoped></style>
